/* 首页 */

    /* banner */

.banner .swiper-pagination-bullet{width: 38px;border-radius: 5px;background: #fff;height: 4px;margin: 0 5px;}

.banner .swiper-pagination-bullet.swiper-pagination-bullet-active{background: rgba(22,158,246,1)}

.banner img{width: 100%; }



    /* 直播列表 */

.show-list .show-title{width: 200px;margin: 40px auto;text-align: center;}

.show-list .container:after{content: '';width: 100%;height: 1px;display: block;clear: both;}

.show-list .show-title span.en{color: #ccc;}

.show-list .show-title h4{color:rgb(62, 185, 183);font-size: 25px;font-weight: normal;}

.show-list .show-title .line{width: 30px;height: 3px;background: rgb(62, 185, 183);margin:10px auto;}

.show-list .show-listbox li{float: left;width: 19%;margin: 0.6%;text-align: center;position: relative;}

.show-list .show-listbox li a{display: inline-block;width: 260px;height: 360px;background-size: cover;border-radius: 12px;}

.show-list .show-listbox li:nth-child(5n+1){margin-left: 0;}

.show-list .show-listbox li:nth-child(5n){margin-right: 0;}

.show-list .show-listbox li .sp-info{position: absolute;height: 58px;line-height: 58px;color: #fff;background: rgba(24,152,249,.42);width: 260px;border-bottom-right-radius: 12px;border-bottom-left-radius: 12px;bottom: 4px;}

.show-list .show-listbox li .sp-info .hot{display: inline-block;height: 26px;line-height: 26px;}

.show-list .show-listbox li .sp-info .hot img{vertical-align: top;margin-right: 8px;}

.show-list .show-listbox li .sp-info .keywords{float: right;margin-right: 25px;max-width:6em;overflow:  hidden;text-overflow: ellipsis;white-space:nowrap}

.loading{margin: 40px auto;text-align: center;width: 340px;}

.loading .line{display: inline-block;height: 1px;width: 120px;background: #ddd;margin-top: 10px;line-height: 1px}

.loading .more{color: #bbb;}

.loading .more img{vertical-align: middle;}

a.room_more{padding: 0px 12px;display: inline-block;color: #bbb}











/* 聊天室界面 */

.chatroom{background: url("../images/img_bg.png") no-repeat center center;min-height: 729px;}

.chatroom .roombox{padding-bottom: 100px;}

.chatroom .room-left{background: #f5f5f5;width: 452px;overflow-x: hidden;}

.chatroom .room-left .user-box{background: #000;color: #fff;height: 120px;}

.chatroom .room-left .user-box  .user-logo{margin: 18px 30px;}

.chatroom .room-left .user-box  .user-logo img{border-radius: 50%;}

.chatroom .room-left .user-box  .user-info .user-info-top{margin: 25px 0px;}

.chatroom .room-left .user-box  .user-info .user-info-top a.befans{display: inline-block;background: rgba(22,158,246,1);color: #fff;padding: 4px 7px;border-radius: 6px;margin-left: 10px;}

.chatroom .room-left .user-box  .user-info .user-info-top a.befans span{font-weight: bolder;}



.chatroom .room-left .user-box  .user-staus{height: 120px;line-height: 120px;margin-left: 25px;}

.chatroom .room-left .user-box  .user-staus img{vertical-align: middle;}

.chatroom .room-left .room-list{height: 729px;width: 467px;overflow-y: auto;}

.chatroom .room-left .room-list .friends{background: rgba(245,245,245,1);border-bottom: 1px #ccc solid;padding: 10px 0px;padding-left:30px;position: relative;}

.chatroom .room-left .room-list .friends img{border-radius: 50%;}

.chatroom .room-left .room-list .friends a{display: inline-block;width: 100%;height: 100%;}

.chatroom .room-left .room-list .friends p{height: 56px;line-height: 56px;margin-left: 20px;}

.chatroom .room-left .room-list .friends a p{color: #000}

.chatroom .room-left .room-list .friends a.befans{display: none; position: absolute;display: inline-block;background: rgba(22,158,246,1);color: #fff;border-radius: 6px;margin-left: 10px;width: 75px;height:29px;text-align: center;line-height: 29px;right: 40px;top: 25px;display: none;}

.chatroom .room-left .room-list .friends a.befans span{font-weight: bolder;}

/*.chatroom .room-left .room-list .friends:hover a.befans{display: inline-block;}*/

    /* 聊天窗口 */

.room-chating{position: relative;min-height: 793px;}

.chatroom .room-right{width: 933px;margin-left: 15px;background: rgba(245,245,245,1);height: 849px;overflow-x: hidden;overflow-y: hidden;position: relative;}

.chatroom .room-right .room-info{background:rgba(22,158,246,1);height: 46px;line-height: 46px;color: #fff;text-align: center;position: relative;}

.chatroom .room-right .room-info span.fr{position: absolute;right: 40px;}

.chatroom .room-right .room-chating .chating-time{text-align: center;margin: 0px auto;background: rgba(237,242,246,1);width:100%;height:20px; line-height:20px;}

.chatroom .room-right .room-chating .timebox{text-align: center;padding: 5px 15px;}

    /* 视频界面 */

.room-video{height: 340px;width: 100%;background: #ccc;}

.vcp-playtoggle{display: none;}

.vcp-timeline{display: none;}

.vcp-timelabel{display:none;}

    /* 接收消息的样式 */

.message.get .message-img{position: relative;}

.message.get .message-img small{position: absolute;bottom: -15px;left: -14px;width: 60px;text-align: center;color: #999;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;}

.chatroom .room-right .room-chating .chat-list p.in_out{text-align: center;color: #ccc;margin: 10px auto;}

.chatroom .room-right .room-chating .message{margin: 10px 0px;min-height: 35px;margin-top:20px;}

.chatroom .room-right .room-chating .message .message-content{position: relative;}

.chatroom .room-right .room-chating .message .message-content img{vertical-align: middle;padding: 2px;max-width: 120px;}

.chatroom .room-right .room-chating .message.get .message-img{margin-left: 20px;float: left;}

.chatroom .room-right .room-chating .message.get .message-img img{width: 32px;height: 32px;border-radius: 50%;}

.chatroom .room-right .room-chating .message.get .message-content{margin-left: 20px;float: left;background: #ddd;padding: 2px 15px;border-radius: 8px;line-height: 30px;min-height: 30px;}

.chatroom .room-right .room-chating .message.send .message-img{margin-left: 20px;float: right;margin-right: 40px;}

.chatroom .room-right .room-chating .message.send .message-img img{width: 32px;height: 32px;border-radius: 50%;}

.chatroom .room-right .room-chating .message .message-content{max-width:700px;word-break:break-all;}

.chatroom .room-right .room-chating .message.send .message-content{float: right;background: #ddd;padding: 2px 15px;border-radius: 8px;line-height: 30px;min-height: 30px;}

.chatroom .room-right .room-chating .message.get .message-content::after{content:'';position: absolute;top:7px;left: -7px; height: 0px;width: 0px;border-top: 10px solid transparent;border-right: 10px solid #ddd;border-bottom: 10px solid transparent;}

.chatroom .room-right .room-chating .message.send .message-content::after{content:''; top:7px;right:-7px; position: absolute; height: 0px;width: 0px;border-top: 10px solid transparent;border-left: 10px solid #ddd;border-bottom:10px solid transparent;}

.chatroom .messagebox{height: 373px;overflow-y: auto;width: 950px;position: relative;overflow: auto;}

.chat-list{position: absolute;bottom: 0px;left: 0px;width: 100%;height: 373px;overflow: auto;}

.warning .bigimg{width: 1600px;text-align: center;height: 100%;margin: 0 auto;}

.warning .bigimg img{text-align: center;width: 100%;vertical-align: middle;}

    /* 聊天框底部操作按钮 */

.room-chating .message-bottom{position: absolute;bottom: -10px;width: 100%;}

.room-chating .message-btn-box{width: 100%;}

.room-chating .message-btn-right{margin-right: 40px;text-align: center;padding-top: 24px;}

.room-chating .message-btn-left{margin-left: 40px;text-align: center;position: relative;min-height: 219px;}

.room-chating .message-btn-left .message-btn-speak{position: absolute;bottom: 0px;}

.room-chating .message-btn{margin: 10px 0px;}

.room-chating .message-btn a{display: block;width: 100%;height: 100%;}

.room-chating .message-btn a img{vertical-align: bottom}

.room-chating .message-speak-box{width: 100%;height: 70px;background: #1aa0f7;}

.room-chating .message-speak-box p{margin: 0px;}

.room-chating .message-speak-box p a{display: block;width: 100%;height: 100%;text-align: center;line-height: 70px;color: #fff;}

.room-chating .message-speak-box p a img{vertical-align: middle;margin: 0px 10px;}

.room-chating .message-btn-left .message-btn{display: none;}

.room-chating .message-btn-left.on .message-btn.on{display: block;}

.room-chating .message-btn-right .message-btn{display: none;}

.room-chating .message-btn-right.on .message-btn.on{display: block;}

.room-chating  .speak-box a.image{display: inline-block;width: 38px;height: 38px;background: url("../images/icon_pic.png") no-repeat center center;line-height: 38px;cursor: pointer;}

.room-chating .fsimg{width: 38px;height: 38px;opacity: 0;vertical-align: top;cursor: pointer;}

    /* 发言权限底部聊天框 */

.message-speak-text{background: #4a4a4a;width: 100%;height: 100%;position: relative;}

.message-speak-text .speaking{position: absolute;top: -150px;width: 100%;text-align: center;}

.message-speak-text .speak-box{width: 850px;margin: 0 auto;height: 70px;line-height: 70px;}

.message-speak-text .speak-box a{margin: 0px 10px;}

.message-speak-text .speak-box img{vertical-align: middle;}

.message-speak-text .speak-box input.text-input{background: #000;color: #fff;border: 0px;width: 595px;height: 40px;border-radius: 30px;text-indent: 2em;outline: none;margin: 0px 10px;}

.message-speak-text .speak-box a.speak-start{width: 537px;height: 40px;display: inline-block;text-align: center;color: #fff;background: #000;margin: 0 10px;line-height: 40px;vertical-align: middle;border-radius: 30px;}

.message-speak-text .speak-box input.text-input.on{text-align: center;cursor: pointer;}

.message-speak-text .speak-box input.text-input.on::-webkit-input-placeholder{color: #fff;}

.message-speak-text .speak-box a.fasong{background: #149ff4;padding:10px 24px;color: #fff;border-radius: 30px;}

    /* 表情包上下收缩窗口 */

.facebag-box .facebag{width: 95%;margin: 0 auto;height: 197px;padding: 2px 30px 2px 32px;overflow-y: auto;position: absolute;}

.facebag-box .facebag a{display: inline-block;width: 10%;margin: 0.2%;text-align: center;}
.facebag-box .facebag a img{width: 72px;}

.facebag-box .facebag span.rong-emoji-content{margin: 3px;}

.facebag-box .facebag span.yxbqb{display: inline-block;width: 50px;height: 50px;line-height: 50px;margin: 3px;vertical-align: middle;}

.facebag-box .facebag span.yxbqb img{width: 100%;vertical-align: middle;}



/* 签到弹窗 */

.qiandaobox a.qiandao-close{position: absolute;right: -45px;top:-45px;}

.qiandao .qiandaobox{width: 800px;position: absolute;left: 0;top: 0px;right: 0px;bottom: 0px;margin: auto;height: 438px;color: #fff;}

.qiandao .qiandaobox .qiandaobg-box{height: 256px;width: 100%;background: url("../images/img_qd_tip.png") no-repeat center center;background-size: 100% 100%;border-radius: 8px;border-bottom-left-radius: 0px;border-bottom-right-radius: 0px;}

.qiandao .qiandaobox .qiandaobg-box .qiandao-month{text-align: right;padding-top: 20px;margin-right: 20px;}

.qiandao .qiandaobox .qiandaobg-box .qiandao-success{text-align: center;width: 135px;height: 135px;border-radius: 50%;color: #fff;font-size: 22px;background: #169df6;margin: 15px auto;line-height: 135px;box-shadow: 0px 0px 5px #5a5a5a;}

.qiandao .qiandaobox .qiandaobg-box .qiandao-num{text-align: center;width: 100%;}

.qiandao-data-box{height: 180px;width: 100%;background: #fff;color: #000;border-bottom-right-radius: 8px;border-bottom-left-radius: 8px;}

.qiandao-data-line-box{position: relative;}

.qiandao-data-line-box .qiandao-data-line{width: 100%;height: 7px;background: #ccc;top:85px;position: absolute;}

.qiandao-data-line-box .qiandao-data-line:after{content:"";width: 156px;height: 7px;background: #1b9ef6;top:0px;position: absolute;}

.qiandao-data-line-box .qiandao-data{width: 520px;margin: 0 auto; padding-top: 66px;position: relative;z-index: 2;}

.qiandao-data-line-box .qiandao-data li{float: left;margin:0px 15px;width: 43px;height: 43px;line-height: 43px;text-align: center;background: #ccc;border-radius: 50%;position: relative;}

.qiandao-data-line-box .qiandao-data li.on{background: #1da0f8;color: #fff;}

.qiandao-data-line-box .qiandao-data li.on:before{content:'';position:absolute;width:30px;height: 7px;background: #1da0f8;top: 19px;left:  -30px;}

.qiandao-data-line-box .qiandao-data li.on:after{content:'';position:absolute;width: 30px;height: 7px;background: #1da0f8;top: 19px;right: -30px;}



/* 直播间密码 */

.room_password{position: fixed;width: 320px;text-align: center;height: 80px;line-height: 80px;top: 0px;right: 0px;left: 0px;bottom: 0px;margin: auto;z-index: 99;background: #fff;border-radius: 16px;padding: 80px;}

.room_password input{height: 40px;border: 1px #ccc solid;border-radius: 8px;text-indent: 1em;outline: none;margin: 0px 15px;}

.room_password a{display: inline-block;background: #1a9df7;color: #fff;height: 42px;vertical-align: middle;line-height: 42px;padding: 0px 15px;border-radius: 8px;}